<!--新增二维码分享-->
<div class="shareTopBox" *ngIf="hasQrCode" [ngStyle]="qrCodeData?.tagData?.data?.info?.shareTopBoxCssStyle|styleFilter">
  <ng-container *ngIf="qrCodeData?.tagData">
    <app-qrcode [tagData]="qrCodeData?.tagData"></app-qrcode>
  </ng-container>
</div>



<div class="shareBox" [ngStyle]="shareBoxCssStyle | styleFilter">
  <ng-container *ngIf="giveMeRecommandList&&giveMeRecommandList.length===0">
    <div class="box" [ngStyle]="tagData?.css?.boxBgCssStyle | styleFilter">
      <div class="user" *ngIf="tagData?.moreCustomer">
        <ng-container *ngFor="let user of customer; let i = index">
          <div class="icon_user" *ngIf="i < 4" appDebounceClick (debounceClick)="shareDetail(user?.nickname,user?.id)">
            <img [src]="user?.avatar" onerror="this.src='assets/icon/portrait50@3x.png'" />
            <p>{{ user?.nickname }}</p>
          </div>
        </ng-container>
        <div class="icon_more" *ngIf="tagData?.moreCustomer">
          <div appDebounceClick (debounceClick)="go(tagData?.moreCustomer?.link)">
            <img src="assets/icon/nav_icon_more_w@3x.png" />
          </div>
          <p>{{ tagData?.moreCustomer?.label }}</p>
        </div>
      </div>
      <div class="share-btn-top" [ngStyle]="tagData?.css?.boxCssStyle | styleFilter"
        *ngIf="tagData?.weixin||tagData?.moment||tagData?.qq||tagData?.qzone||tagData?.sms||tagData?.ks">
        <div class="icon-btn sms" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter" *ngIf="tagData?.sms">
          <div class="weixin-bg" appDebounceClick
            (debounceClick)="shareSMS(tagData?.sms?.title,tagData?.sms?.content,tagData?.sms?.imageUrl,tagData?.sms?.webpageUrl)">
            <img src="assets/laijian/share_icon_message@3x.png"
              onerror="this.src='assets/laijian/share_icon_message@3x.png'" />
          </div>
          <p>{{ tagData?.sms?.label }}</p>
        </div>
        <div class="icon-btn kwai" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter" *ngIf="tagData?.kwai">
          <div class="ks-bg" appDebounceClick
            (debounceClick)="shareKS(tagData?.kwai?.title,tagData?.kwai?.content,tagData?.kwai?.imageUrl,tagData?.kwai?.webpageUrl)">
            <img src="assets/laijian/share_icon_ks@3x.png" onerror="this.src='assets/laijian/share_icon_ks@3x.png'" />
          </div>
          <p>{{ tagData?.kwai?.label }}</p>
        </div>
        <div class="icon-btn weixin" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter" *ngIf="tagData?.weixin">
          <div class="weixin-bg" appDebounceClick
            (debounceClick)="shareWeiXin(tagData?.weixin?.title,tagData?.weixin?.content,tagData?.weixin?.imageUrl,tagData?.weixin?.webpageUrl)">
            <img src="assets/icon/share_icon_WeChat@3x.png" onerror="this.src='assets/icon/share_icon_WeChat@3x.png'" />
          </div>
          <p>{{ tagData?.weixin?.label }}</p>
        </div>
        <div class="icon-btn moment" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter" *ngIf="tagData?.moment">
          <div appDebounceClick
            (debounceClick)="shareMoments(tagData?.moment?.title,tagData?.moment?.content,tagData?.moment?.imageUrl,tagData?.moment?.webpageUrl)">
            <img src="assets/icon/share_icon_Wechat Moments@3x.png"
              onerror="this.src='assets/icon/share_icon_Wechat Moments@3x.png'" />
          </div>
          <p>{{ tagData?.moment?.label }}</p>
        </div>
        <div class="icon-btn qq" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter" *ngIf="tagData?.qq">
          <div appDebounceClick
            (debounceClick)="shareQQ(tagData?.qq?.title,tagData?.qq?.content,tagData?.qq?.imageUrl,tagData?.qq?.webpageUrl)">
            <img src="assets/icon/share_icon_qq@3x.png" onerror="this.src='assets/icon/share_icon_qq@3x.png'" />
          </div>
          <p>{{ tagData?.qq?.label }}</p>
        </div>
        <div class="icon-btn qzone" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter" *ngIf="tagData?.qzone">
          <div appDebounceClick
            (debounceClick)="shareQQZone(tagData?.qzone?.title,tagData?.qzone?.content,tagData?.qzone?.imageUrl,tagData?.qzone?.webpageUrl)">
            <img src="assets/icon/share_icon_QQ Zone@3x.png"
              onerror="this.src='assets/icon/share_icon_QQ Zone@3x.png'" />
          </div>
          <p>{{ tagData?.qzone?.label }}</p>
        </div>
      </div>
      <div class="line" *ngIf="tagData?.moreCustomer"></div>
      <div class="operate" [ngStyle]="tagData?.css?.boxCssStyle | styleFilter">

        <div class="icon-btn" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter"
          *ngIf="tagData?.dingding && isShowButton">
          <div appDebounceClick
            (debounceClick)="shareDingTalk(tagData?.dingding?.title,tagData?.dingding?.content,tagData?.dingding?.imageUrl,tagData?.dingding?.webpageUrl)">
            <img src="assets/icon/share_icon_ding@3x.png" onerror="this.src='assets/icon/share_icon_ding@3x.png'" />
            <p>{{ tagData?.dingding?.label }}</p>
          </div>
        </div>


        <!-- 复制按钮 -->
        <ng-container *ngIf="tagData?.copy">
          <div class="icon_copy" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter">
            <div appDebounceClick (debounceClick)="copyUrl(tagData?.copy?.content)">
              <img src="assets/icon/share_icon_Copy link@3x.png" />
            </div>
            <p>{{ tagData?.copy?.label }}</p>
          </div>
        </ng-container>


        <!-- 保存图片 -->
        <div class="icon_save" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter"
          *ngIf="tagData?.savePic && isShowButton">
          <div appDebounceClick (debounceClick)="savePic()">
            <img src="assets/icon/share_icon_save_pictures@3x.png" />
          </div>
          <p>{{ tagData?.savePic?.label }}</p>
        </div>

        <!--海报分享-->
        <div class="icon_save" [ngStyle]="tagData?.css?.iconCssStyle | styleFilter"
          *ngIf="tagData?.posterSharing && isShowButton">
          <div appDebounceClick (debounceClick)="posterSharing(tagData?.posterSharing)">
            <img src="assets/icon/share_icon_save_pictures@3x_new.png" />
          </div>
          <p>{{ tagData?.posterSharing?.label }}</p>
        </div>

        <ng-container
          *ngIf="tagData.dingding&&tagData.copy&&tagData.savePic||tagData.dingding&&tagData.copy&&tagData.posterSharing">
          <div class="icon_save">
            <div style="background: white;">
              <img src="#" style="display: none;" />
            </div>
            <p></p>
          </div>
        </ng-container>

        <ng-container
          *ngIf="!tagData.dingding&&tagData.copy&&tagData.savePic||!tagData.dingding&&tagData.copy&&tagData.posterSharing">
          <ng-container *ngIf="tagData.dingding&&tagData.copy">
            <div class="icon_save">
              <div style="background: white;">
                <img src="#" style="display: none;" />
              </div>
              <p></p>
            </div>
            <div class="icon_save">
              <div style="background: white;">
                <img src="#" style="display: none;" />
              </div>
              <p></p>
            </div>
          </ng-container>
        </ng-container>
      </div>
    </div>
  </ng-container>
  <ng-container *ngIf="giveMeRecommandList&&giveMeRecommandList.length>0">


    <div *ngIf="backBtnLabel" [ngStyle]="backBtnLabelCssStyle|styleFilter" class="backBtn" appDebounceClick
      (debounceClick)="dismiss()">{{backBtnLabel}}</div>
    <div *ngIf="headTitle" [ngStyle]="headTitleCssStyle|styleFilter" class="headTitle">{{headTitle}}</div>

    <p id="p_{{giveMeRecommendListId}}" [ngStyle]="giveMeRecommandList[0].titleCssStyle|styleFilter"
      class="titlePublish">{{recommendListTitle}}</p>
    <p *ngIf="giveMeRecommandList[0].title2 !== undefined"
      [ngStyle]="giveMeRecommandList[0].title2CssStyle|styleFilter">{{giveMeRecommandList[0].title2}}</p>
    <div id="{{giveMeRecommendListId}}" class="ulbox" *ngIf="giveMeRecommandList"
      [ngStyle]="giveMeRecommandList[0].ulBoxCssStyle|styleFilter">
      <ng-container *ngFor="let item of giveMeRecommandList">



        <!--2023-10-17 H5分享上只显示复制-->
        <li *ngIf="(item.name !=='tikTok' || (item.name ==='tikTok'&& appGlobalService?.enableDouyinShare))
        && !(item.name==='kwai' && client==='ios' ) 
        && (item.name==='copy' || isShowButton )" class="ulbox-li  2"
          appDebounceClick (debounceClick)="iconButtonClick(item)" [ngStyle]="item.boxCssStyle|styleFilter">
          <ng-container *ngIf="item.cssType">
            <div class="li-clicle-js" [ngStyle]="item.liBoxCssStyle|styleFilter">
              <img class="js-li-img" src="{{item.icon}}" [ngStyle]="item.iconCssStyle|styleFilter"
                onerror="this.src='assets/laijian/home_icon_recommend-zhufang@3x.png'" />
            </div>
            <p class="li-p" [ngStyle]="item.labelCssStyle|styleFilter">{{item.label}}</p>

          </ng-container>
          <ng-container *ngIf="!item.cssType">

            <div class="li-clicle" [ngStyle]="item.liBoxCssStyle|styleFilter">
              <img class="li-img" src="{{item.icon}}" [ngStyle]="item.iconCssStyle|styleFilter"
                onerror="this.src='assets/laijian/home_icon_recommend-zhufang@3x.png'" />
            </div>
            <p class="li-p" [ngStyle]="item.labelCssStyle|styleFilter">{{item.label}}</p>

          </ng-container>
        </li>



      </ng-container>
    </div>
    <div class="back-btn" *ngIf="this.isShowPublishList">
      <p appDebounceClick (debounceClick)="goBackToGiveMeRecommend()" class="back-font">
        {{this.secondLevelModalData.back}}</p>
    </div>
    <p id="p_{{publishListId}}" class="titleWant" style="display: none;">您想要</p>
    <div id="{{publishListId}}" class="publish-box" *ngIf="this.secondLevelModalData">

      <ng-container *ngFor="let item of this.secondLevelModalData.data">
        <li class="publish-li" appDebounceClick (debounceClick)="publishClick(item)">
          <img class="publish-li-img" src="{{item.icon}}"
            onerror="this.src='assets/laijian/release_icon_zhaodian@3x.png'" />
          <p class="publish-li-p">{{item.name}}</p>
        </li>
      </ng-container>
    </div>
  </ng-container>
  <ng-container *ngIf="showDismissBtn">
    <div class="cancel" appDebounceClick (debounceClick)="dismiss()">取消</div>
  </ng-container>
</div>